
$prefixCls:'sp-tab';

.sp-tab{

    width:100%;
    height:100%;
    background-color: white;
    display: flex;
    align-items: center; 
    
    &-item{
        @include flex-center;
        flex:1;
        position: relative;
        height:100%;

        &.active{
            .#{$prefixCls}-item_label{
                color:var(--color-primary);
            }
            .#{$prefixCls}-item_active{
                background-color: var(--color-primary);
            }
        }

        &_label{
            color: #666F83;
            font-size: 28px;
            font-weight: 400; 
        }
        &_active{
            position: absolute;
            width:90%;
            // background-color: var(--color-primary);
            height:4px;
            transform: translateX(-50%);
            left:50%;
            bottom:0;
        }
    }

}